#{extends 'main.html' /}
#{set title:'Profile view' /}
#{set 'moreScripts'}
    <script src="@{'/public/javascripts/jquery.dataTables.min.js'}" type="text/javascript" charset="${_response_encoding}"></script>
    <script>
        $(document).ready( function() {
            oTable = $('.resultTable').dataTable();
        });
    </script>
#{/set}

#{navigation /}

<div class="content">
	#{if flash.success}
		<p class="success">
			&{flash.success}
		</p>
	#{/if}
	
	<h1>Profile of ${user.name}</h1>
	#{if user.realname}
	Real Name: ${user.realname}<br>
	#{/if}
	
	Total Comments: ${user.comments.size()} <br>
	
	#{if user.isPremium}
	Total Questions asked: ${user.questionCount()} <br>
	#{/if}
	
	#{if user.isExpert}
	Total Answers given: ${user.answerCount()} <br>
	#{/if}
	<br>
	
	#{if flash.results}
	
	<h1> Results: </h1>
	
	<div style="width: 80%; margin: auto">
		<table cellpadding="0" cellspacing="0" border="0" class="resultTable" id="userTable">
			<thead>
				<tr><th></th><th>Type</th></tr>
			</thead>
			<tbody>
				#{list items:comments, as:'comment'}
					#{if comment.lecture}
						<tr><td><a href=@{Lectures.show(comment.lecture.id)}>${comment.lecture.course.name}: ${comment.lecture.name}</a></td><td>Comment</td></tr>
					#{/if}
					#{else}
						<tr><td><a href=@{Questions.show(comment.question.id)}>${comment.question.title}</a></td><td>Comment</td></tr>
					#{/else}
				#{/list}
				#{list items:questions, as:'question'}
					#{if question.answered}
						<tr><td><a href=@{Answers.show(question.id)}> ${question.title}</a></td><td>Question</td></tr>
					#{/if}
					#{else}
						<tr><td><a href=@{Questions.show(question.id)}> ${question.title}</a></td><td>Question</td></tr>
					#{/else}
				#{/list}
				#{list items:answers, as:'answer'}
					<tr><td><a href=@{Answers.show(answer.question.id)}> ${answer.title} </a></td><td>Answer</td></tr>
				#{/list}
			</tbody>
		</table>
	</div>
	#{/if}
	
	<br><br><a href=@{Users.findPosts(user.id)}>Find all posts by this user</a>
</div>